<style lang="less">
  .card_style {
    height: 100%;
    width: 100%;
    overflow: hidden;
    .ivu-card-body {
      padding: 0px;
    }
  }
  .page_style {
    margin-top: 10px;
    text-align: right;
  }
  .bench_search {
    margin-bottom: 10px;
  }
  .nopadding .ivu-table-cell {
    padding: 0px 0px;
  }
  .item1{
    height: 42px;
    line-height: 40px;
  }
  .marginR2 {
    margin-right: 2%;
  }
  .fontsize20 {
    font-size: 20px;
  }
  .fontTitle {
    font-size: 20px;
    height: 52px;
    text-align: right;
    padding-top: 16px;
    // vertical-align: bottom;
  }
  .fontContent {
    font-size: 20px;
    height: 52px;
    text-align: left;
    padding-top: 16px;
    color: #dc9387;
    // vertical-align: bottom;
  }
  .countNum {
    font-size: 35px;
    color: #dc9387;
  }
  .new-btn-sty {
    margin-right: 5px;
    color: #fff;
    background-color: #235CA7;
    border-color: #235CA7;
    font-weight: 500;
  }
  .new-btn-sty1 {
    margin-right: 5px;
    color: #fff;
    background-color: #598ED1;
    border-color: #598ED1;
    font-weight: 500;
  }
</style>

<template>
  <Card class="card_style" :bordered="false" :dis-hover="true">
    <Tabs :animated="false" @on-click="getCountData" v-model="searchInfo.tab_index">
      <TabPane label="社区统计">
        <Row class="bench_search">
          <Col span="4" v-if="companyCode === 'LM'">
            <span>区县：</span>
            <Select v-model="searchInfo.level1" transfer="" @on-change="getMailList(searchInfo.level1,1)" style="width: 70%;">
              <Option :value="item.id" v-for="item in mailList[0]" v-bind:key="item.id">{{item.title}}</Option>
            </Select>
          </Col>
          <Col span="4" v-if="companyCode === 'LM'">
            <span>街道：</span>
            <Select v-model="searchInfo.level2" transfer="" @on-change="getMailList(searchInfo.level2,2)" style="width: 70%;">
              <Option :value="item.id" v-for="item in mailList[1]" v-bind:key="item.id">{{item.title}}</Option>
            </Select>
          </Col>
          <Col span="4" v-if="companyCode === 'LM'">
            <span>社区：</span>
            <Select v-model="searchInfo.level3" transfer="" style="width: 70%;">
              <Option :value="item.id" v-for="item in mailList[2]" v-bind:key="item.id">{{item.title}}</Option>
            </Select>
          </Col>
          <Col span="6">
            <span>时间范围：</span>
            <DatePicker type="datetimerange" format="yyyy/MM/dd" transfer="" style="width: 70%"
            placement="bottom-end" v-model="searchInfo.applytime"></DatePicker>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="10" v-if="companyCode === 'LM'">
            <span>事项名称：</span>
            <Select v-model="searchInfo.item_id" filterable transfer="" style="width: 70%;">
              <Option :value="item.id" v-for="item in eventListSC" v-bind:key="item.id">{{item.text}}</Option>
            </Select>
          </Col>
          <Col span="2" offset="8" class="marginR2">
            <Button class="new-btn-sty" @click="searchData"><Icon type="ios-search" /> 查询统计</Button>
          </Col>
          <Col span="2" class="marginR2">
            <Button class="new-btn-sty1" @click="exportData"><Icon type="ios-download-outline"/> 导出结果</Button>
          </Col>
        </Row>
        <Table v-show="searchInfo.shape" :loading="searchInfo.loading1" :columns="columns1" :data="datalist" ref="table1"></Table>
      </TabPane>
      <TabPane label="事项办理统计" v-if="companyCode === 'LM'">
        <Row class="bench_search">
          <Col span="8">
            <span>事项名称：</span>
            <Input v-model="searchInfo.item_name" placeholder="事项名称" clearable style="width: 70%" />
          </Col>
          <Col span="6">
            <span>时间范围：</span>
            <DatePicker type="datetimerange" format="yyyy-MM-dd" transfer="" style="width: 70%"
            placement="bottom-end" v-model="searchInfo.applytime1"></DatePicker>
          </Col>
          <Col span="2" class="marginR2">
            <Button class="new-btn-sty" @click="searchData1(searchInfo.applytime1, null)"><Icon type="ios-search" /> 查询统计</Button>
          </Col>
          <Col span="2">
            <Button class="new-btn-sty1" @click="exportData1"><Icon type="ios-download-outline"></Icon> 导出结果</Button>
          </Col>
        </Row>
        <Table border :loading="searchInfo.loading2" :columns="columns2" :data="itemlist" ref="table2"></Table>
        <Modal v-model="itemModalInfo.show" :title="itemModalInfo.title" width="1000">
          <Table border :loading="searchInfo.loading3" :columns="columns3" :data="itemhandlelist" ref="table3"></Table>
          <Page :total="itemModalInfo.totalRecord" class="page_style" :current="itemModalInfo.pageNo"
          :page-size="itemModalInfo.pageSize" @on-change="getHandleList"/>
          <div slot="footer">
            <!-- <Button type="info" @click="exportData2"><Icon type="ios-download-outline"></Icon> 导出本页名单</Button> -->
            <Button type="error" @click="itemModalInfo.show=false">关闭</Button>
          </div>
        </Modal>
      </TabPane>
      <TabPane label="归类排名" v-if="companyCode === 'LM'">
        <Row class="bench_search">
          <Col span="8">
            <span>时间范围：</span>
            <DatePicker type="datetimerange" format="yyyy/MM/dd" transfer="" style="width: 70%"
            placement="bottom-end" v-model="searchInfo.applytime2"></DatePicker>
          </Col>
          <Col span="2">
            <Button class="new-btn-sty" @click="searchData1(searchInfo.applytime2, '1')"><Icon type="ios-search" /> 查询统计</Button>
          </Col>
        </Row>
        <Table border :loading="searchInfo.loading4" :columns="columns4" :data="sortitemlist"></Table>
        <Col span="16" offset="4">
          <Card :bordered="false" :dis-hover="true">
            <my-chart-pie style="height: 400px;" :value="sortitemlist" :run="searchInfo.runPie" :showLegend="true"/>
          </Card>
        </Col>
      </TabPane>
      <TabPane label="月度受理趋势图" v-if="companyCode === 'LM'">
        <Row class="bench_search">
          <Col span="8" v-if="companyCode === 'LM'">
            <span>事项名称：</span>
            <Select v-model="searchInfo.item_id2" filterable transfer="" style="width: 70%;">
              <Option :value="item.id" v-for="item in eventListSC" v-bind:key="item.id">{{item.text}}</Option>
            </Select>
          </Col>
          <Col span="2">
            <Button class="new-btn-sty" @click="searchData2"><Icon type="ios-search" /> 查询统计</Button>
          </Col>
        </Row>
        <Col>
          <Row v-show="!searchInfo.barflag" >
            <Col class="demo-spin-col" style="height: 400px;">
              <Spin fix>
                <Icon type="ios-loading" size=60 class="demo-spin-icon-load"></Icon>
              </Spin>
            </Col>
          </Row>
          <my-chart-bar style="height: 500px;" v-if="searchInfo.barflag" :value="barData"
          :run="searchInfo.runBar" text="月度受理趋势图"/>
        </Col>
      </TabPane>
      <TabPane label="阶段性汇总" v-if="companyCode === 'LM'">
        <Row class="bench_search">
          <Col span="8">
            <span>时间范围：</span>
            <DatePicker type="datetimerange" format="yyyy/MM/dd" transfer="" style="width: 70%"
            placement="bottom-end" v-model="searchInfo.applytime3"></DatePicker>
          </Col>
          <Col span="2" class="marginR2">
            <Button class="new-btn-sty" @click="searchData3"><Icon type="ios-search" /> 查询统计</Button>
          </Col>
          <Col span="2">
            <Button class="new-btn-sty1" @click="report"><Icon type="md-paper" /> 查看报告</Button>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="8" style="height: 400px;">
            <Card dis-hover>
              <p slot="title"><Icon type="ios-podium-outline" /> 事项办理排名</p>
              <div style="margin: 10px 5px" v-for="(item, index) in tab5list1" v-bind:key="item.id">
                <span style="margin: 10px">{{index+1}}</span>
                <span style="margin: 10px">{{item.name}}</span>
                <span style="float: right; margin-right: 10px;">{{item.value}}件</span>
              </div>
            </Card>
          </Col>
          <Col span="16">
            <Card :bordered="false" :dis-hover="true">
              <my-chart-pie style="height: 400px;" :value="tab5list1" v-if="searchInfo.tab5Pie1"
              :run="searchInfo.runTab5Pie1" :showLegend="false"/>
            </Card>
          </Col>
        </Row>
        <Row class="bench_search">
          <Col span="8">
            <Card dis-hover>
              <p slot="title"><Icon type="ios-podium-outline" /> 区域受理排名</p>
              <div style="margin: 10px 5px" v-for="(item, index) in stageSummaryList" v-bind:key="item.id">
                <span style="margin: 10px">{{index+1}}</span>
                <span style="margin: 10px">{{item.sq_name}}</span>
                <span style="float: right; margin-right: 10px;">{{item.num}}</span>
              </div>
            </Card>
          </Col>
          <Col span="16">
            <Card :bordered="false" :dis-hover="true">
              <my-chart-bar style="height: 400px;" :value="barDataTab5" :run="searchInfo.runTab5Bar2"
              v-if="searchInfo.tab5Bar2"/>
            </Card>
          </Col>
        </Row>
        <!-- 阶段性汇总报告 -->
        <Modal v-model="modalTab5Info.show" :title="modalTab5Info.title" width="700" :closable="false">
          <Form label-position="right" :label-width="100">
            <Row>
              <Col span="10" class="fontTitle">本阶段受理的事项数为:</Col>
              <Col span="10" offset="1" class="fontsize20">
                <div class="count-to-con">
                  <count-to :end="modalTab5Info.num" count-class="countNum">
                    <span slot="right">&nbsp;件</span>
                  </count-to>
                </div>
              </Col>
            </Row>
            <Row>
              <Col span="10" class="fontTitle">办结的事项数为:</Col>
              <Col span="10" offset="1" class="fontsize20">
                <div class="count-to-con">
                  <count-to :end="modalTab5Info.finish_num" count-class="countNum">
                    <span class="slot-text" slot="right">&nbsp;件</span>
                  </count-to>
                </div>
              </Col>
            </Row>
            <Row>
              <Col span="10" class="fontTitle">受理事项最多的社区:</Col>
              <Col span="10" offset="1" class="fontContent">
                <Icon type="ios-ribbon" size="25"/> {{modalTab5Info.maxSQname}}
              </Col>
            </Row>
            <Row>
              <Col span="10" class="fontTitle">受理最多的事项:</Col>
              <Col span="10" offset="1" class="fontContent">
                <Icon type="ios-ribbon" size="25"/> {{modalTab5Info.maxItemName}}
              </Col>
            </Row>
            <Row>
              <Col span="10" offset="1">
                <Card>
                  <p slot="title"><Icon type="ios-ribbon" /> {{modalTab5Info.maxSQname}}</p>
                  <Row type="flex" justify="center" align="middle" class="countto-page-row">
                    <div class="count-to-con">
                      <count-to :end="modalTab5Info.maxSQ" count-class="countNum">
                        <span class="slot-text" slot="left">受理量:&nbsp;</span>
                        <span class="slot-text" slot="right">&nbsp;件</span>
                      </count-to>
                      <count-to :end="modalTab5Info.maxSQ2" count-class="countNum">
                        <span class="slot-text" slot="left">办结量:&nbsp;</span>
                        <span class="slot-text" slot="right">&nbsp;件</span>
                      </count-to>
                      <count-to :end="modalTab5Info.maxSQ3" count-class="countNum">
                        <span class="slot-text" slot="left">办结率:&nbsp;</span>
                        <span class="slot-text" slot="right">&nbsp;%</span>
                      </count-to>
                    </div>
                  </Row>
                </Card>
              </Col>
              <Col span="10" offset="1">
                <Card>
                  <p slot="title"><Icon type="ios-ribbon" /> {{modalTab5Info.maxItemName}}</p>
                  <Row type="flex" justify="center" align="middle" class="countto-page-row">
                    <div class="count-to-con">
                      <count-to :end="modalTab5Info.maxItem" count-class="countNum">
                        <span class="slot-text" slot="left">受理量:&nbsp;</span>
                        <span class="slot-text" slot="right">&nbsp;件</span>
                      </count-to>
                      <count-to :end="modalTab5Info.maxItem2" count-class="countNum">
                        <span class="slot-text" slot="left">办结量:&nbsp;</span>
                        <span class="slot-text" slot="right">&nbsp;件</span>
                      </count-to>
                      <count-to :end="modalTab5Info.maxItem3" count-class="countNum">
                        <span class="slot-text" slot="left">办结率:&nbsp;</span>
                        <span class="slot-text" slot="right">&nbsp;%</span>
                      </count-to>
                    </div>
                  </Row>
                </Card>
              </Col>
            </Row>
          </Form>
          <div slot="footer">
            <Button type="error" @click="modalTab5Info.show=false">关闭</Button>
          </div>
        </Modal>
      </TabPane>
      <TabPane label="问题咨询统计" v-if="companyCode !== 'LM'">
       <Row class="bench_search">
          <Col span="8">
            <span>时间范围：</span>
            <DatePicker type="datetimerange" format="yyyy/MM/dd" transfer="" style="width: 70%"
            placement="bottom-end" v-model="apptime"></DatePicker>
          </Col>
          <Col span="2">
            <Button class="new-btn-sty" @click="findtime(true)"><Icon type="ios-search" /> 搜索</Button>
          </Col>
        </Row>
        <Table border :columns="columns5" :data="rowlist" ref="table3"></Table>
        <Modal v-model="listdetails"  :title="info1" width="1000">
          <Table border :columns="columns6" :data="listdetailsdata" ref="table5"></Table>
          <Page :total="totalnum" class="page_style" :current="currentpageNo" :page-size="currentpageSize" @on-change="change3"/>
          <div slot="footer">
            <!--<Button type="info" @click="exportData2"><Icon type="ios-download-outline"></Icon> 导出本页名单</Button>-->
            <Button type="error" @click="listdetails=false">关闭</Button>
          </div>
        </Modal>
      </TabPane>
      <TabPane label="各社区问题咨询统计" v-if="companyCode === 'LM'">
        <Row class="bench_search">
        <Col span="8">
          <span>时间范围：</span>
          <DatePicker type="datetimerange" format="yyyy/MM/dd" transfer="" style="width: 70%"
          placement="bottom-end" v-model="apptime"></DatePicker>
        </Col>
        <Col span="2">
          <Button class="new-btn-sty" @click="findtime(false)"><Icon type="ios-search" /> 搜索</Button>
        </Col>
        </Row>
        <Table border :columns="columns7" :data="rowlist2" ref="table4"></Table>
        <Modal v-model="listdetailss"  :title="info1" width="1000">
          <Table border :columns="columns8" :data="listdetailsdataaa" ref="table5"></Table>
        <Page :total="totalnum" class="page_style" :current="currentpageNo" :page-size="currentpageSize" @on-change="change1"/>
          <div slot="footer">
            <!--<Button type="info" @click="exportData2"><Icon type="ios-download-outline"></Icon> 导出本页名单</Button>-->
            <Button type="error" @click="listdetailss=false">关闭</Button>
          </div>
        </Modal>
      </TabPane>
    </Tabs>
  </Card>
</template>

<script>
import { eventlist, getMailLevelList, date2str, getCompanyCountList, getPeriodList, getItemHandleList, getMonthAcceptList, byRowidList, byQlnameInfo, findStreetNum, byCreatebyInfoList } from '@/api/eventlist'
import { MyChartPie, MyChartBar } from '_c/charts'
import CountTo from '_c/count-to'
export default {
  name: 'closingratelist',
  components: {
    MyChartPie,
    MyChartBar,
    CountTo
  },
  data () {
    return {
      rowlist: [],
      apptime: [],
      currentpageNo: 1,
      currentpageSize: 1,
      totalnum: 0,
      rowlist2: [],
      info1: '名单详情',
      listdetailsdata: [],
      getparam: {},
      listdetails: false,
      listdetailss: false,
      listdetailsdataaa: [],
      searchInfo: {
        tab_index: 0,
        // tab1页面内图表转换控制 true为表 false为图
        shape: true,
        runPie: 0,
        runBar: '0',
        runTab5Pie1: 0,
        runTab5Bar2: '0',
        barflag: true,
        tab5Pie1: true,
        tab5Bar2: true,
        level1: 0,
        item_id: '',
        item_id2: '',
        applytime: [],
        applytime1: [],
        applytime2: [],
        applytime3: [],
        loading1: false,
        loading2: false,
        loading3: false,
        loading4: false
      },
      barData: {
        legend: ['受理量'],
        xAxis: [],
        xAxisMap: {},
        seriesData: [
          { name: '受理量', data: new Array(30), type: 'bar' }
        ]
      },
      barDataTab5: {
        legend: ['受理量', '办结量'],
        xAxis: [],
        seriesData: [
          { name: '受理量', data: [], type: 'bar' },
          { name: '办结量', data: [], type: 'bar' }
        ]
      },
      // 第5tab页汇总统计报告弹出框
      modalTab5Info: {
        show: false,
        num: 0,
        finish_num: 0,
        maxItem: 0,
        maxItem2: 0,
        maxItem3: 0,
        maxSQ: 0,
        maxSQ2: 0,
        maxSQ3: 0
      },
      // 第二tab页的事项办理名单弹出框
      itemModalInfo: { show: false, pageNo: 1, pageSize: 10 },
      // 第一tab页社区统计列表数据
      datalist: [],
      // 第5个tab页中事项办理数据
      tab5list1: [],
      // 第5个tab页阶段汇总数据
      stageSummaryList: [],
      // 第二tab页事项办理统计数据
      itemlist: [],
      // 第三tab页归类排名数据
      sortitemlist: [],
      // 第二tab页事项办理名单数据
      itemhandlelist: [],
      mailList: [[], [], []],
      eventListSC: [],
      columns1: [
        { title: '序号', type: 'index', width: 100, align: 'center' },
        { title: '办理机构名称', key: 'sq_name', align: 'center' },
        { title: '受理量（项）', key: 'num', width: 200, align: 'center', sortable: true },
        { title: '办结量（项）', key: 'finish_num', width: 200, align: 'center', sortable: true },
        {
          title: '办结率',
          key: 'percent',
          width: 200,
          sortable: true,
          align: 'center',
          render: (h, params) => {
            return h('div', [h('strong', params.row.percent.toFixed(2) + '%')])
          }
        }
      ],
      columns2: [
        { title: '序号', type: 'index', width: 80, align: 'center' },
        { title: '事项名称', key: 'title', align: 'center' },
        { title: '事项编号', key: 'item_id', width: 150, align: 'center' },
        { title: '受理量（项）', key: 'num1', width: 140, align: 'center', sortable: true },
        { title: '办结量（项）', key: 'finish_num', width: 140, align: 'center', sortable: true },
        {
          title: '办结率',
          key: 'percent',
          width: 140,
          sortable: true,
          align: 'center',
          render: (h, params) => {
            let num = 0
            if (params.row.num1) {
              num = params.row.finish_num / params.row.num1 * 100
            }
            return h('div', [h('strong', num.toFixed(2) + '%')])
          }
        },
        {
          title: '操作',
          key: 'action',
          width: 150,
          align: 'center',
          className: 'nopadding',
          render: (h, params) => {
            let temp = []
            temp.push(
              h('Button', {
                props: { type: 'info', size: 'small' },
                style: {},
                on: {
                  click: () => {
                    this.itemDetail(params.row)
                  }
                }
              }, '办理名单')
            )
            return h('div', temp)
          }
        }
      ],
      columns3: [
        { title: '序号', type: 'index', width: 60, align: 'center' },
        // { title: '事项名称', key: 'index', width: 100, align: 'center' },
        { title: '办理社区', key: 'company_name', align: 'center' },
        { title: '办理时间', key: 'create_time', width: 170, align: 'center' },
        { title: '办理状态', key: 'process_name', width: 110, align: 'center' },
        { title: '申请人姓名', key: 'name', width: 110, align: 'center' },
        { title: '申请人证件号', key: 'cardno', width: 170, align: 'center' },
        { title: '联系方式', key: 'mobile', width: 150, align: 'center' }
      ],
      columns5: [
        { title: '序号', type: 'index', width: 100, align: 'center' },
        { title: '事项名称', key: 'QL_NAME', align: 'center' },
        { title: '办理数量', key: 'num', align: 'center' },
        { title: '操作',
          key: 'action',
          align: 'center',
          render: (h, params) => {
            let temp = []
            temp.push(
              h('Button', {
                props: { type: 'info', size: 'small' },
                style: {},
                on: {
                  click: () => {
                    this.qlnameList(params)
                  }
                }
              }, '查看名单')
            )
            return h('div', temp)
          }

        }

      ],
      columns6: [
        { title: '序号', type: 'index', width: 100, align: 'center' },
        { title: '姓名', key: 'name', align: 'center' },
        { title: '电话', key: 'moblie', align: 'center' },
        { title: '身份证号', key: 'cardno', align: 'center' }
      ],
      columns8: [
        { title: '序号', type: 'index', width: 100, align: 'center' },
        { title: '事项名称', key: 'QL_NAME', align: 'center' },
        { title: '咨询数量', key: 'num', align: 'center' }
      ],
      columns7: [
        { title: '序号', type: 'index', width: 100, align: 'center' },
        { title: '社区名称', key: 'community', align: 'center' },
        { title: '咨询数量', key: 'num', align: 'center' },
        { title: '操作',
          key: 'action',
          align: 'center',
          render: (h, params) => {
            let temp = []
            temp.push(
              h('Button', {
                props: { type: 'info', size: 'small' },
                style: {},
                on: {
                  click: () => {
                    this.communityInfo(params)
                  }
                }
              }, '查看名单')
            )
            return h('div', temp)
          }

        }
      ],
      columns4: [
        { title: '序号', type: 'index', width: 80, align: 'center' },
        { title: '类别名称', key: 'title', align: 'center' },
        { title: '类别编号', key: 'item_id', width: 400, align: 'center' },
        { title: '受理量（项）', key: 'num1', width: 200, align: 'center' }
      ]
    }
  },
  computed: {
    companyCode () {
      return this.$store.state.user.severUserInfo.company_code
    }
  },
  methods: {
    findtime (flag) {
      let datatime = {
        create_time_start: date2str(this.apptime[0]),
        create_time_end: date2str(this.apptime[1])
      }
      if (flag) {
        this.rowlist1(datatime)
      } else {
        this.allcommunity(datatime)
      }
    },
    change3 (pageNo) {
      this.currentpageNo = pageNo
      this.qlnameList(this.getparam)
    },
    change1 (pageNo) {
      this.currentpageNo = pageNo
      this.communityInfo(this.getparam)
    },
    communityInfo (param) {
      this.getparam = param
      let create_by = param.row.create_by
      let obj4 = { 'create_by': create_by,
        'pageNo': this.currentpageNo,
        'pageSize': this.currentpageSize,
        create_time_start: date2str(this.apptime[0]),
        create_time_end: date2str(this.apptime[1]) }
      byCreatebyInfoList(obj4).then(res => {
        if (res.data.errcode === 0) {
          this.listdetailss = true
          this.listdetailsdataaa = res.data.data.results
          this.totalnum = res.data.data.totalRecord
        } else {
          this.$Notice.error({ title: '获取信息失败', desc: '获取社区咨询量详情失败' })
        }
      })
      this.currentpageNo = 1
    },
    // 查看所有社区咨询量
    allcommunity (param) {
      findStreetNum(param).then(res => {
        if (res.data.errcode === 0) {
          this.rowlist2 = res.data.data
        } else {
          this.$Notice.error({ title: '获取信息失败', desc: '获取各社区咨询量失败' })
        }
      })
    },
    // 查看事项问题办结量
    qlnameList (param) {
      this.listdetails = true
      this.getparam = param
      let qlname = param.row.QL_NAME
      let data0 = { 'QL_NAME': qlname,
        'pageNo': this.currentpageNo,
        'pageSize': this.currentpageSize,
        create_time_start: date2str(this.apptime[0]),
        create_time_end: date2str(this.apptime[1]) }
      byQlnameInfo(data0).then(res => {
        if (res.data.errcode === 0) {
          this.listdetailsdata = res.data.data.results
          this.totalnum = res.data.data.totalRecord
        } else {
          this.$Notice.error({ title: '获取信息失败', desc: '获取名单失败' })
        }
      })
      this.currentpageNo = 1
    },
    // 查看事项问题办结量
    rowlist1 (param) {
      byRowidList(param).then(res => {
        if (res.data.errcode === 0) {
          this.rowlist = res.data.data
        } else {
          this.$Notice.error({ title: '获取信息失败', desc: '查询事项咨询量失败' })
        }
      })
    },
    // 已有事项列表，页面搜索栏使用
    getItemList () {
      eventlist({}).then(res => {
        if (res.data.errcode === 0) {
          this.eventListSC = res.data.data
          this.eventListSC.unshift({ id: 0, text: '全部' })
          this.$forceUpdate()
        } else {
          this.$Notice.error({ title: '获取信息失败', desc: '查询事项劣列表失败' })
        }
      })
    },
    // 社区统计下拉搜索框的级联查询
    getMailList (id, index) {
      if (id === 0) {
        this.mailList[index] = []
        this.searchInfo['level' + (index + 1)] = ''
        return
      }
      getMailLevelList({ id: id }).then(res => {
        if (res.data.errcode === 0) {
          this.mailList[index] = res.data.data
          this.mailList[index].unshift({ id: 0, title: '全部' })
          this.$forceUpdate()
        } else {
          this.$Notice.error({ title: '获取信息失败', desc: '查询区域列表信息失败' })
        }
      })
    },
    // 点击【事项办理统计】tab时查询事项列表
    getCountData () {
      if (this.searchInfo.tab_index === 1) {
        this.searchData1(this.searchInfo.applytime1, null)
      } else if (this.searchInfo.tab_index === 2) {
        this.searchData1(this.searchInfo.applytime2, '1')
      } else if (this.searchInfo.tab_index === 3) {
        let day1 = new Date()
        for (let i = 29; i >= 0; i--) {
          let temp = date2str(day1)
          this.barData.xAxis[i] = temp.substring(5)
          this.barData.xAxisMap[temp] = i
          day1.setDate(day1.getDate() - 1)
        }
        this.searchData2()
      } else if (this.searchInfo.tab_index === 4) {
        this.searchData3()
      }
    },
    // 社区受理统计查询
    searchData () {
      this.searchInfo.loading1 = true
      let para = {
        item_id: this.searchInfo.item_id,
        start_time: date2str(this.searchInfo.applytime[0]),
        end_time: date2str(this.searchInfo.applytime[1])
      }
      if (this.companyCode === 'LM') {
        para.id = this.searchInfo.level3 || this.searchInfo.level2 || this.searchInfo.level1 || ''
        para.level = this.searchInfo.level3 ? '4' : this.searchInfo.level2 ? '3' : this.searchInfo.level1 ? '2' : '1'
      } else {
        para.level = '4'
      }
      getCompanyCountList(para).then(res => {
        if (res.data.errcode === 0) {
          this.datalist = res.data.data
          let totalNum = { sq_name: '合计', num: 0, finish_num: 0, percent: 0 }
          this.datalist.forEach(function (temp1, index) {
            totalNum.num += temp1.num
            totalNum.finish_num += temp1.finish_num
          })
          totalNum.percent = totalNum.finish_num / totalNum.num * 100
          this.datalist.push(totalNum)
          this.searchInfo.loading1 = false
        } else {
          this.$Notice.error({ title: '统计失败', desc: res.data.errmsg })
        }
      })
    },
    // 事项统计查询,type=1表示归类排名，否则表示事项办理统计排名
    searchData1 (timearray, type) {
      this.searchInfo.loading2 = true
      this.searchInfo.loading4 = true
      let para = {
        ql_name: this.searchInfo.item_name,
        type: type,
        start_time: date2str(timearray[0]),
        end_time: date2str(timearray[1])
      }
      this.itemlist = []
      getPeriodList(para).then(res => {
        if (res.data.errcode === 0) {
          if (type === '1') {
            this.sortitemlist = res.data.data
            this.sortitemlist.forEach(function (temp1, index) {
              temp1.name = temp1.title
              temp1.value = temp1.num1
            })
            this.searchInfo.runPie++
          } else {
            this.itemlist = res.data.data
          }
          this.searchInfo.loading4 = false
          this.searchInfo.loading2 = false
        } else {
          this.$Notice.error({ title: '统计失败', desc: '' })
        }
      })
    },
    // 月度受理趋势图 全部事项和单个事项
    searchData2 () {
      for (let i = 0; i < 30; i++) {
        this.barData.seriesData[0].data[i] = 0
      }
      this.searchInfo.barflag = false
      getMonthAcceptList({ item_id: this.searchInfo.item_id2 }).then(res => {
        if (res.data.errcode === 0) {
          let barData = this.barData
          res.data.data.forEach(function (item, index) {
            let i = barData.xAxisMap[item.day]
            barData.seriesData[0].data[i] = item.num
          })
          this.searchInfo.runBar = parseInt(this.searchInfo.runBar) + 1 + ''
          this.searchInfo.barflag = true
        } else {
          this.$Notice.error({ title: '统计失败', desc: '' })
        }
      })
    },
    searchData3 () {
      let para = {
        start_time: date2str(this.searchInfo.applytime3[0]),
        end_time: date2str(this.searchInfo.applytime3[1]),
        level: '1'
      }
      if (para.start_time) {
        this.modalTab5Info.title = para.start_time + ' ~ ' + para.end_time + ' 汇总统计报告'
      } else {
        this.modalTab5Info.title = '运营至今汇总统计报告'
      }
      this.searchInfo.tab5Pie1 = false
      getPeriodList(para).then(res => {
        if (res.data.errcode === 0) {
          this.tab5list1 = []
          if (res.data.data.length > 10) {
            for (let i = 0; i < 10; i++) {
              let temp22 = res.data.data[i]
              this.tab5list1.push({ id: i, name: temp22.title, value: temp22.num1 })
            }
            let templist1 = { id: 10, name: '其他事项', value: 0 }
            for (let i = 10; i < res.data.data.length; i++) {
              templist1.value += res.data.data[i].num1
            }
            this.tab5list1.push(templist1)
          } else {
            for (let i = 0; i < res.data.data.length; i++) {
              let temp22 = res.data.data[i]
              this.tab5list1.push({ id: i, name: temp22.title, value: temp22.num1 })
            }
          }
          this.modalTab5Info.maxItem = res.data.data[0].num1
          this.modalTab5Info.maxItem2 = res.data.data[0].finish_num
          this.modalTab5Info.maxItem3 = this.modalTab5Info.maxItem2 / this.modalTab5Info.maxItem * 100
          this.modalTab5Info.maxItemName = res.data.data[0].title
          this.searchInfo.runTab5Pie1++
          this.searchInfo.tab5Pie1 = true
        } else {
          this.$Notice.error({ title: '统计失败', desc: '' })
        }
      })
      this.searchInfo.tab5Bar2 = false
      getCompanyCountList(para).then(res => {
        if (res.data.errcode === 0) {
          this.stageSummaryList = res.data.data
          let barDataTab5 = this.barDataTab5
          let tempModal = this.modalTab5Info
          barDataTab5.xAxis = []
          barDataTab5.seriesData[0].data = []
          barDataTab5.seriesData[1].data = []
          this.stageSummaryList.forEach(function (temp1, index) {
            temp1.id = index
            tempModal.num += temp1.num
            tempModal.finish_num += temp1.finish_num
            barDataTab5.xAxis.push(temp1.sq_name)
            barDataTab5.seriesData[0].data.push(temp1.num)
            barDataTab5.seriesData[1].data.push(temp1.finish_num)
          })
          this.modalTab5Info.maxSQ = this.stageSummaryList[0].num
          this.modalTab5Info.maxSQ2 = this.stageSummaryList[0].finish_num
          this.modalTab5Info.maxSQ3 = this.modalTab5Info.maxSQ2 / this.modalTab5Info.maxSQ * 100
          this.modalTab5Info.maxSQname = this.stageSummaryList[0].sq_name
          this.searchInfo.runTab5Bar2 = parseInt(this.searchInfo.runTab5Bar2) + 1 + ''
          this.searchInfo.tab5Bar2 = true
        } else {
          this.$Notice.error({ title: '统计失败', desc: res.data.errmsg })
        }
      })
    },
    report () {
      this.modalTab5Info.show = true
    },
    // 导出社区统计数据
    exportData () {
      if (this.datalist.length === 0) {
        this.$Notice.warning({ title: '导出失败', desc: '无统计数据' })
        return
      }
      let today = new Date()
      this.$refs.table1.exportCsv({
        filename: '社区受理统计' + date2str(today),
        original: false
      })
    },
    // 导出事项统计
    exportData1 () {
      if (this.itemlist.length === 0) {
        this.$Notice.warning({ title: '导出失败', desc: '无统计数据' })
        return
      }
      let today = new Date()
      this.$refs.table2.exportCsv({
        filename: '事项统计' + date2str(today),
        original: false
      })
    },
    // 事项统计后查询每个事项的办理人员名单
    itemDetail (item) {
      this.itemModalInfo.title = item.item_name + '-办理人员名单'
      this.itemModalInfo.item_id = item.item_id
      this.itemModalInfo.show = true
      this.getHandleList(1)
    },
    // 每个事项办理人员名单列表
    getHandleList (pageNo) {
      this.searchInfo.loading3 = true
      let para = {
        item_id: this.itemModalInfo.item_id,
        pageNo: pageNo,
        pageSize: this.itemModalInfo.pageSize
      }
      getItemHandleList(para).then(res => {
        if (res.data.errcode === 0) {
          this.itemhandlelist = res.data.data.results
          this.itemModalInfo.totalRecord = res.data.data.totalRecord
          this.searchInfo.loading3 = false
        } else {
          this.$Notice.error({ title: '查询失败', desc: '获取办理人员名单失败' })
        }
      })
    }
    // 导出人员名单功能暂停
    // exportData2 () {
    //   if (this.itemhandlelist.length === 0) {
    //     this.$Notice.warning({ title: '导出失败', desc: '无统计数据' })
    //     return
    //   }
    //   this.$refs.table3.exportCsv({
    //     filename: this.itemModalInfo.title,
    //     original: false
    //   })
    // }
  },
  mounted () {
    this.allcommunity()
    this.rowlist1()
    this.getMailList(null, 0)
    this.getItemList()
    this.searchData()
  }
}
</script>
